<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<title>${title}-首页</title>
		<link rel="icon" type="image/x-icon" href="${app }/static/favicon.ico">
		[#include "/html/include/easyuicss.html" /]
		[#include "/html/include/easyuijs.html" /]
		<script type="text/javascript" src="${app }/static/js/common.utils.js"></script>
	</head>
	<body class="easyui-layout">
		<div data-options="region:'north'" class="banner">
			<div class="left">
				<div style="float: left;width: 200px;padding-top: 15px;padding-left: 50px;box-sizing: border-box;">
					<img src="${app}/static/images/qymh/hw-word.png" />
				</div>
				<ul class="top-menu">
					[@fl_module_list userId='${user.user_id}' moduleLevel='1']
					[#list tag_list as module]
					<li moduleId='${module.module_id}' ${(module_index==0)?string('class="active"', '')}>
					<a href="javascript:;">
						${module.module_name}
					</a>
					</li>
					[/#list]
					[/@fl_module_list]
				</ul>
				<div style="clear: both;"></div>
			</div>
			<div class="right">
				<a href="javascript:;" class="easyui-menubutton" data-options="iconCls:'fa fa-user',hasDownArrow:false" style="color:#fff;">
					当前用户：${user.real_name }
				</a>&nbsp;|&nbsp;
				<a href="javascript:;" class="easyui-menubutton" menu="#kzmbMenu" iconCls="fa fa-cog" style="color: #FFFFFF">控制面板</a>&nbsp;|&nbsp;
				<a href="javascript:;" class="easyui-menubutton" menu="#zxMenu" iconCls="fa fa-sign-out" style="color: #FFFFFF">注销</a>
				<div id="kzmbMenu" style="width: 100px; display: none;font-size: 15px;">
					<div iconCls="fa fa-info-circle" onclick="easyui.createWindow('个人信息', '${app}/sysmgr/user/edit.do?method=show&userId=${user.user_id}', '650px', '330px', window.name)">个人信息</div>
					<div class="menu-sep"></div>
					<div iconCls="fa fa-key" onclick="easyui.createWindow('修改密码', '${app}/sysmgr/user/modifyPwd.do?userId=${user.user_id}', '400px', '250px', window.name)">修改密码</div>
					<div class="menu-sep"></div>
					<div iconCls="fa fa-arrows-alt" onclick="fullScreen(this);">全屏窗口</div>
				</div>
				<div id="zxMenu" style="width: 100px; display: none;font-size: 15px;">
					<div id="loginOut" iconCls="fa fa-sign-out">退出系统</div>
				</div>
			</div>
			<div style="clear: both;"></div>
		</div>
		<div data-options="region:'south'" style="height:25px;">
			<div style="padding-top: 4px;text-align: center;">
				&copy; 版权所有 <a href="mailto:changshuai_0115@163.com" title="后台管理系统" target="_blank">changshuai_0115@163.com</a> (推荐谷歌浏览器，获得更快响应速度) &nbsp;&nbsp;技术支持: <a href="mailto:changshuai_0115@163.com" title="联系我" target="_blank">changshuai_0115@163.com</a>
			</div>
		</div>
		<div data-options="region:'east',title:'辅助工具',iconCls:'icon-reload',collapsed:true" style="width:200px;">
			<div id="tabs" class="easyui-tabs" border="false" style="height: 240px">
				<div title="日历">
					<div id="layout_east_calendar"></div>
				</div>
			</div>
		</div>
		<div id="module" data-options="region:'west',split:false" title="导航菜单" style="width:200px;">

		</div>
		<div data-options="region:'center'" style="overflow:hidden;">
			<div id="maintabs" class="easyui-tabs" fit="true" border="false">
				<div title="首页" iconCls="fa fa-home fa-lg" href="">
					首页
				</div>
			</div>
		</div>
		<div id="mm" class="easyui-menu" style="width: 150px;display: none;">
			<div id="mm-tabclose">关闭</div>
			<div id="mm-tabcloseall">全部关闭</div>
			<div id="mm-tabcloseother">关闭其他</div>
			<div class="menu-sep"></div>
			<div id="mm-tabcloseright">关闭右侧标签</div>
			<div id="mm-tabcloseleft">关闭左侧标签</div>
		</div>
	</body>
	<script type="text/javascript" src="${app }/static/layer/layer.js"></script>
	<script type="text/javascript" src="${app }/static/screenfull/screenfull.min.js"></script>
    <script type="text/javascript">
		$.parser.onComplete = function() {/* 页面所有easyui组件渲染成功后，隐藏等待信息 */

		};
		$('#loginOut').on('click', loginOut);

		$(function() {
			bindTabEvent();
			bindTabMenuEvent();
			$('#layout_east_calendar').calendar({
				fit : true,
				current : new Date(),
				border : false,
				onSelect : function(date) {
					$(this).calendar('moveTo', new Date());
				}
			});

			$(".top-menu li").on("click", function(){
				$(this).addClass('active');
				$(this).siblings().removeClass('active');
				var parentId = $(this).attr('moduleId');
                common.ajax('${app}/module.do', 'parentId='+parentId,
                    'POST', 'html', true,
                    function(result){
						$('#module').html(result);
                        $(".easyui-accordion").accordion({
                            fit: true,
                            border: false
                        });
                        $('.easyui-tree').tree({
                            fit: false,
                            border: false,
                            onClick: function(node){
                                openThisNode(node);
                            }
                        });
                    }
                );
			});

			$(".top-menu li").eq(0).trigger("click");
		});

		function bindTabEvent() {
			/* 双击关闭TAB选项卡 */
			$(".tabs-inner").dblclick(function() {
				var subtitle = $(this).children(".tabs-closable").text();
				$('#tabs').tabs('close', subtitle);
			})
			/* 为选项卡绑定右键 */
			$(".tabs-inner").bind('contextmenu', function(e) {
				$('#mm').menu('show', {
					left : e.pageX,
					top : e.pageY
				});

				var subtitle = $(this).children(".tabs-closable").text();

				$('#mm').data("currtab", subtitle);
				return false;
			});
		}
		// 绑定右键菜单事件
		function bindTabMenuEvent() {
			// 关闭当前
			$('#mm-tabclose').click(function() {
				var currtab_title = $('#mm').data("currtab");
				$('#maintabs').tabs('close', currtab_title);
			})
			// 全部关闭
			$('#mm-tabcloseall').click(function() {
				$('.tabs-inner span').each(function(i, n) {
					var t = $(n).text();
					if (t != '首页') {
						$('#maintabs').tabs('close', t);
					}
				});
			});
			// 关闭除当前之外的TAB
			$('#mm-tabcloseother').click(function() {
				$('#mm-tabcloseright').click();
				$('#mm-tabcloseleft').click();
			});
			// 关闭当前右侧的TAB
			$('#mm-tabcloseright').click(function() {
				var nextall = $('.tabs-selected').nextAll();
				if (nextall.length == 0) {
					//alert('后边没有啦~~');
					return false;
				}
				nextall.each(function(i, n) {
					var t = $('a:eq(0) span', $(n)).text();
					$('#maintabs').tabs('close', t);
				});
				return false;
			});
			// 关闭当前左侧的TAB
			$('#mm-tabcloseleft').click(function() {
				var prevall = $('.tabs-selected').prevAll();
				if (prevall.length == 0) {
					//alert('到头了，前边没有啦~~');
					return false;
				}
				prevall.each(function(i, n) {
					var t = $('a:eq(0) span', $(n)).text();
					if (t != '首页') {
						$('#maintabs').tabs('close', t);
					}
				});
				return false;
			});
		}

		function loginOut(){
			layer.confirm('您确定要退出吗？', {
				btn: ['确定','取消'], //按钮
				icon: 5
			}, function(){//确定
				$.ajax({
					type: 'POST',
					url: '${app}/loginOut.do',
					dataType: 'text',
					success: function (res) {
						if (res == 1){
							window.location.href="${app}/login.do";
						}
					},
					error: function (result, type) {
						layer.msg('error', {icon: 2 });
					}
				});
			}, function(){
				return true;
			});
		}

		function openThisNode(node) {
			if(node.state == "open"){
				$('.easyui-tree').tree('collapse', node.target);
				return;
			}
			var children = $('.easyui-tree').tree('getChildren', node.target);
			var pnode = null;
			try{
				pnode = $('.easyui-tree').tree('getParent', node.target);
			}catch(e){

			}
			if (pnode && children && children.length > 0) {
				$(pnode).each(function() {
					$('.easyui-tree').tree('collapse', this);
				});
				$('.easyui-tree').tree('expand', node.target);
			} else if (children && children.length > 0) {
				$('.easyui-tree').tree('collapseAll');
				$('.easyui-tree').tree('expand', node.target);
			}
		}

		function fullScreen(obj){
			if(screenfull.enabled){
				// 仅仅只进行全屏而不退出全屏可以调用
				// screenfull.request() 方法。
				screenfull.toggle();
				if ($(obj).text() == '全屏窗口') {
					$(obj).find('.menu-text').text('退出全屏');
				} else {
					$(obj).find('.menu-text').text('全屏窗口');
				}
			} else {
				// Ignore or do something else
			}
		}
    </script>
</html>